<!-- js/ts代码 -->
<script lang="ts">
  export default{
    name:'App'
  }
</script>

<!-- html代码 -->
<template>
  <h1>vue3框架</h1>
</template>

<!-- css代码 -->
<style scoped>

</style>


<!-- 
1. 为什么需要 export？
在 JavaScript 早期，所有代码通常写在一个文件里，导致：

变量污染：所有变量、函数都是全局的，容易被覆盖或冲突。
代码复用难：无法直接在多个文件间共享代码。
示例（没有 export，无法共享代码）
// utils.ts
function greet(name: string) {
  return `你好, ${name}!`;
}

如果 main.ts 想用 greet，直接 import 是不行的：

// main.ts
import greet from './utils'; // ❌ 会报错：找不到 `greet`
console.log(greet("张三"));
❌ 失败的原因：utils.ts 没有 export，所以 greet 不能被其他文件访问。


export 让代码可以被其他文件使用
export 让 greet 这个函数变成 可被外部访问的模块：

// utils.ts
export function greet(name: string) {
  return `你好, ${name}!`;
}
然后在 main.ts 里就可以 import 进来：

// main.ts
import { greet } from './utils';

console.log(greet("张三")); // ✅ 你好, 张三!

✅ 总结
export 让变量、函数、类 可以被外部导入。
import 让我们可以 在其他文件使用这些导出的内容。


export default function xx() {}	  import xx from '模块'	      ❌ 不需要 {}
export function xx() {}	          import { xx } from '模块'	  ✅ 必须 {}
export + as	export { xx as yy }	  import { yy } from '模块'  	✅ 必须 {}
-->